<template>
  <div>
    <h1>姓名：{{ info }}</h1>
    <h1>姓名1：{{ info1 }}</h1>
    <ul>
      <li v-for="(item, index) in todos" :key="index">
        <span>{{item.text}}</span>
      </li>
    </ul>
    <el-input v-model="input" placeholder="请输入内容" style="width: 200px"></el-input>
    <el-button type="primary" @click="addTodo">添加</el-button>
    <!-- <h2>兴趣：{{ info.interest }}</h2> -->
    <p><nuxt-link to="/">Home</nuxt-link></p>
  </div>
</template>
<script>
import { mapMutations } from 'vuex'

export default {
  // 方式二
  async asyncData({ app }) {
    const res = await app.$axios.$get('/test/user')
    const res1 = await app.$axios.$get('/test/getUserInfo')
    return {
      info: res,
      info1: res1
    }
  },
  data() {
    return {
      input: '',
    }
  },
  computed: {
    todos () {
      return this.$store.state.todos.list
    }
  },
  methods: {
    async addTodo () {
      const text = this.input
      this.$store.commit('todos/add', text)
      const res1 = await this.$axios.$get('/test/user')
      console.log('res1', res1)
      this.input = ''
    },
    ...mapMutations({
      toggle: 'todos/toggle'
    }),
    getDiscount(userKey) {
      // const discounts = {
      //   '普通会员': 0.9,
      //   '年费会员': 0.85,
      //   '超级会员': 0.8,
      //   'default': 1
      // }
      // return discounts[userKey] || discounts.default
      // const discounts = new Map([
      //   ['普通会员', 0.9],
      //   ['年费会员', 0.85],
      //   ['超级会员', 0.8],
      //   ['default', 1]
      // ])
      // return discounts.get(userKey) || discounts.get('default')

      const strategies = new Map([
        ['A_D', 4 * 1.2],
        ['B_D', 3 * 1.2],
        ['C_D', 2 * 1.2],
        ['A_F', 4 * 0.9],
        ['B_F', 3 * 0.9],
        ['C_F', 2 * 0.9]
      ])
      const calculateBonus = (performanceLevel, salary, department) => {
        return strategies.get(`${performanceLevel}_${department}`) * salary
      }
      calculateBonus( 'B', 20000, 'D' ) // 输出：72000
    }
  }
}
</script>
